<template>
  <div>
    <TopFilter ref="bottomFilter" :list="inputDate1" :cols="3" :collapse="true" @filterChange="changeHandle1" @onCollapse="collapseHandle1"></TopFilter>
    <FilterTable
      ref="table"
      height="300"
      :columns="columns1"
      :fetchapi="fetchApiDetail"
      :isSelectColumn="false"
      :params="fetchParams1"
      :datakey="'rows'"
      :onColumnsChange="columns => (this.columns1 = columns)"
      :isExportExcel="true"
      exportFileName="配件流水账.xlsx"
      :onCalcExportData="exportHandle"
    >
    </FilterTable>
    <BaseDialog :visible.sync="showPanel" title="标题" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }"> </BaseDialog>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import moment from 'moment';
import { getAllUser } from '@/api/customerRepair/afterSaleVisit/resultEntry';
import { searchPartWaterByDto, searchPartWaterDetail, exportData } from '@/api/part/partOther/partWaterBook';
import { confirmAction, notifyAction } from '@/utils';

export default {
  mixins: [dictionary],
  props: { WAfetchParams: {} },
  mounted() {
    this.getQueryBookingInformation();
  },
  watch: {
    WAfetchParams: {
      handler(newVal, oldVal) {
        if (newVal) {
          console.log('WAfetchParams', newVal);
          this.changeHandle1(newVal);
        }
      }
    }
  },
  data() {
    return {
      fetchApiDetail: searchPartWaterDetail,
      inputDate1: this.inputDate(),
      serviceAdvisorData: [],
      fetchParams: { xhrAbort: true },
      fetchParams1: { xhrAbort: true },
      columns1: this.createTableColumns1(),
      showPanel: false,
      syncTableData: [] // 同步的table数据
    };
  },
  methods: {
    inputDate() {
      return [
        {
          type: 'RANGE_DATE',
          label: '查看日期',
          fieldName: 'start|end',
          placeholder: '查看日期',
          dateType: 'daterange'
        },
        {
          type: 'SELECT',
          label: '进出类型',
          fieldName: 'inOutType',
          filterable: true,
          placeholder: '请输入...',
          itemList: this.createDictList(8249, [82491008, 82491025, 82491026, 82491027, 82491028, 82491029, 82491018, 82491016, 82491017, 82491003, 82491012, 82491024, 82491015])
        }
      ];
    },
    createTableColumns1() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '发生日期',
          dataIndex: 'operateDate',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'date-range',
          showOverflowTooltip: true
        },
        {
          title: '进出类型',
          dataIndex: 'inOutType',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: this.createDictList('8249', [82491008, 82491025, 82491026, 82491027, 82491028, 82491029, 82491018, 82491016, 82491017, 82491003, 82491012]),
          dictItems: this.createDictList('8249'),
          render: (props, h) => {
            return <span> {this.createDictText(props.row.inOutType, '8249')} </span>;
          },
          showOverflowTooltip: true
        },
        {
          title: '进数量',
          dataIndex: 'stockInQuantity',
          sorter: true,
          filter: true,
          precision: 2,
          filterType: 'number',
          showOverflowTooltip: true
        },
        {
          title: '出数量',
          dataIndex: 'stockOutQuantity',
          sorter: true,
          filter: true,
          precision: 2,
          filterType: 'number',
          showOverflowTooltip: true
        },
        {
          title: '出入不含税单价',
          dataIndex: 'inOutNetPrice',
          sorter: true,
          filter: true,
          precision: 2,
          filterType: 'number',
          showOverflowTooltip: true
        },
        {
          title: '出入不含税金额',
          dataIndex: 'inOutNetAmount',
          sorter: true,
          filter: true,
          precision: 2,
          filterType: 'number',
          showOverflowTooltip: true
        },
        {
          title: '出入库含税单价',
          dataIndex: 'inOutTaxedPrice',
          sorter: true,
          filter: true,
          precision: 2,
          filterType: 'number',
          showOverflowTooltip: true
        },
        {
          title: '出入库含税金额',
          dataIndex: 'inOutTaxedAmount',
          sorter: true,
          filter: true,
          precision: 2,
          filterType: 'number',
          showOverflowTooltip: true
        },
        {
          title: '入账后库存数量',
          dataIndex: 'stockQuantity',
          sorter: true,
          filter: true,
          precision: 2,
          filterType: 'number',
          showOverflowTooltip: true
        },
        {
          title: '含税成本单价',
          dataIndex: 'costPrice',
          sorter: true,
          filter: true,
          precision: 2,
          filterType: 'number',
          showOverflowTooltip: true
        },
        {
          title: '含税成本金额',
          dataIndex: 'costAmount',
          sorter: true,
          filter: true,
          precision: 2,
          filterType: 'number',
          showOverflowTooltip: true
        },
        {
          title: '车牌号',
          dataIndex: 'license',
          sorter: true,
          filter: true,
          filterType: 'input',
          showOverflowTooltip: true
        },
        {
          title: '单据号码',
          dataIndex: 'sheetNo',
          sorter: true,
          filter: true,
          filterType: 'input',
          showOverflowTooltip: true
        },
        {
          title: '客户名称',
          dataIndex: 'customerName',
          sorter: true,
          filter: true,
          filterType: 'input',
          showOverflowTooltip: true
        },
        {
          title: '操作员',
          dataIndex: 'createdBy',
          sorter: true,
          filterType: 'input',
          dictItems: [],
          render: props => {
            return <span>{this.getEmployeeName(props.row.createdBy)}</span>;
          },
          showOverflowTooltip: true
        }
      ];
    },
    async getQueryBookingInformation() {
      let res = await getAllUser();
      this.serviceAdvisorData = res.data.map(x => ({ text: x.employeeName, value: x.userId }));
      // 导出翻译人名
      this.columns1.find(x => x.dataIndex == 'createdBy').dictItems = this.serviceAdvisorData;
      console.log(this.serviceAdvisorData, 'this.serviceAdvisorData:::');
    },
    changeHandle1(val) {
      if (val.start) {
        val.start = moment(val.start).format('YYYY-MM-DD');
      }
      if (val.end) {
        val.end = moment(val.end).format('YYYY-MM-DD');
      }
      console.log(this.WAfetchParams, 'WAfetchParams:::');
      let data = {
        start: val.start,
        end: val.end,
        partNo: this.WAfetchParams.partNo,
        inOutType: val.inOutType,
        partType: this.WAfetchParams.partType
      };
      this.fetchParams1 = Object.assign({}, data);
    },
    collapseHandle1() {
      this.$nextTick(() => {
        this.BaseTable.EXECUTE_RESET_HEIGHT();
      });
    },
    exportHandle(row) {
      for (const key in row) {
        if (row.hasOwnProperty(key)) {
          let element = row[key];
          if (!isNaN(row[key])) {
            if (key == 'license') {
              return;
            } else if (key == 'index') {
              return;
            } else if (key == 'customerName') {
              return;
            }
            row[key] = Number(row[key]).toFixed(2);
          }
        }
      }
    },
    getEmployeeName(userId) {
      const item = this.serviceAdvisorData.find(x => {
        return x.value == userId;
      });
      return item ? item.text : '';
    },
    // 点击搜索
    handleSearch() {},
    // 同步table数据
    handleSyncTableData(list) {
      this.syncTableData = list;
    }
  }
};
</script>

<style scoped></style>
